<template>
	<ve-content>
		<!-- 筛选条件 -->
		<ve-filtrate
			:advanced="true"
			:filtrates="filtrates"
			:search-loading="isLoading"
			@submit="filterSubmit"
		/>
		<!-- 表格和分页器 -->
		<ve-operation>
			<el-button
				v-permiss-code="'rc/system/account-add'"
				type="primary"
				@click="editId = ''; isShowAccountDialog = true;"
			>
				添加账号
			</el-button>
			<div class="page-hint">
				<span class="el-icon-warning" />注：此处主要为平台账号与保利威账号中留的邮箱信息关联；关联后，视频从保利同步过来时可对应出优路员工为上传人信息
			</div>
		</ve-operation>
		<!-- 表格 -->
		<ve-table v-loading="isLoading" :data="tableList">
			<el-table-column
				type="index"
				label="序号"
				width="50"
				:index="(index) => (page.pageIndex - 1) * page.pageSize + index + 1"
			/>
			<el-table-column prop="teacherName" label="用户姓名" width="100" />
			<el-table-column prop="uploadUserEmail" label="保利邮箱" />
			<el-table-column prop="updateUserName" label="修改人" width="100" />
			<el-table-column prop="updateTime" label="修改时间" />
			<el-table-column prop="createUserName" label="创建人" width="100" />
			<el-table-column prop="createTime" label="创建时间" />
			<el-table-column
				label="操作"
				width="90px"
				fixed="right"
				v-slot="{ row }"
			>
				<el-button
					v-permiss-code="'rc/system/account-edit'"
					type="text"
					@click="editId = row.relationId; isShowAccountDialog = true;"
				>
					修改
				</el-button>
				<el-button
					v-permiss-code="'rc/system/account-delete'"
					type="text"
					@click="onDelete(row.relationId)"
				>
					删除
				</el-button>
			</el-table-column>
		</ve-table>
		<!-- 分页器 -->
		<ve-pagination :get-page="queryTableData" :page.sync="page" />
		<account-edit-dialog
			v-if="isShowAccountDialog"
			:visibly.sync="isShowAccountDialog"
			:id="editId"
			@success="queryTableData"
		/>
	</ve-content>
</template>

<script src="./index.mjs"/>

<style lang="less" scoped>
	.page-hint {
		display: inline-block;
		padding: 0 10px;
		margin-left: 20px;
		font-size: 12px;
		color: #3a3d4b;
		line-height: 30px;
		background-color: #fffbe6;
		border: 1px solid #ffe58f;
		border-radius: 6px;

		.el-icon-warning {
			color: #ffa613;
			font-size: 15px;
			margin-right: 6px;
		}
	}
</style>
